﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <link href="css/one.css" rel="stylesheet" type="text/css" />
</head>
<body>
      <div id="container" class="container">
            <div class="wrap">
                <a href="http://www.flickr.com/photos/archetypefotografie/3601313864/">
                    <img src="images/image1.jpg" alt="Picture 1"/>
                </a>
            </div>
            <div class="wrap">
                <a href="http://www.flickr.com/photos/vegaseddie/3910559910/">
                    <img src="images/image2.jpg" alt="Picture 2"/>
                </a>
            </div>
            <div class="wrap">
                <a href="http://www.flickr.com/photos/62337512@N00/445175934/">
                    <img src="images/image3.jpg" alt="Picture 3"/>
                </a>
            </div>
            <div class="wrap">
                <a href="http://www.flickr.com/photos/brunociampi/2461177417/">
                    <img src="images/image4.jpg" alt="Picture 4"/>
                </a>
            </div>
            <div class="wrap">
                <a href="http://www.flickr.com/photos/beadmobile/3298460491/">
                    <img src="images/image5.jpg" alt="Picture 5"/>
                </a>
            </div>
            <div class="wrap">
                <a href="http://www.flickr.com/photos/tonythemisfit/3839281139/">
                    <img src="images/image6.jpg" alt="Picture 6"/>
                </a>
            </div>
            
      </div>
    <script src="../../common_script/jquery-1.6.2.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $('#container img').hover(
			    function () {
				    var $this = $(this);
				    $this.stop().animate({ 'opacity': '1.0', 'height': '200px', 'top': '0px', 'left': '0px'});
			    },
			    function () {
				    var $this = $(this);
				    $this.stop().animate({ 'opacity': '0.5', 'height': '500px', 'top': '-66.5px', 'left': '-150px' });
			    }
		    );
        });
    </script>
</body>
</html>
